<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <title>Purple Admin</title>
  <th:block th:replace="librarian/common :: head"></th:block>
</head>

<body>
  <div class="container-scroller">
    <!-- partial:../../partials/_navbar.html -->
    <div th:replace="librarian/common :: navbar"></div>
    <!-- partial -->
    <div class="container-fluid page-body-wrapper">
      <div class="row row-offcanvas row-offcanvas-right">
        <!-- partial:../../partials/_sidebar.html -->

        <th:block th:replace="librarian/common :: sidebar"></th:block>
        <!-- partial -->
        <div class="content-wrapper">
          <div class="row">
          
            
<div class="col-lg-12">
                  <div class="card">
     
                    <div class="card-header d-flex align-items-center">
                      <h3 class="h4">Delete History</h3>
                    </div>
                    <div class="card-body">
                      <div class="table-responsive">   
                        <table class="table table-striped table-sm">
                          <thead>
                            <tr>
                              <th>deletingTime</th>
                              <th>bookId</th>
                              <th>librarianName</th>
                              <th>librarianEmail</th>
                            </tr>
                          </thead>
                           <tbody id="list"></tbody>
                        </table>
                      </div>
                    </div>
                  </div>
                </div>

          </div>
        </div>
        <!-- content-wrapper ends -->
        <!-- partial:../../partials/_footer.html -->
        <div th:replace="librarian/common :: footer"></div>
        <!-- partial -->
      </div>
      <!-- row-offcanvas ends -->
    </div>
    <!-- page-body-wrapper ends -->
  </div>
  <!-- container-scroller -->
  <!-- plugins:js -->
  <div th:replace="librarian/common :: scripts"></div>
     <script>
    // $("#select1").bind("click", function(){
        $.ajax({
            url: "/api/history/deleting",
            type: "GET",
            dataType:'json',
            async: false, 

            success: function(resp){
              
                $.each(resp.data,
                function(i,values){
                    $('#list').append(
                       // "<tr><td>"+values.bookId+"</td></tr>"
                    "<tr><td>"+values.deletingTime+"</td>"
                    +"<td>"+values.book.bookId+"</td>"+
                    "<td>"+values.librarian.name+"</td>"+
                    "<td>"+values.librarian.email+"</td></tr>"
                    );
                }
                   
                );
                  console.log(resp.data);
            }   
    });    
</script>

</body>

</html>
